<template>
	<view class="container">
		<uni-forms ref="form" :modelValue="formData">
			<uni-forms-item label="手机号码" class="tagCode">
				<view style="display: flex; flex-direction: row;">
					<uni-easyinput type="text" class="uni-input" v-model="phonenumber" placeholder="请输入手机号码" />
					<button size="mini" @click="">获取验证码</button>
				</view>
				
			</uni-forms-item>
			<uni-forms-item label="用户名" class="tagName">
				<uni-easyinput type="text" class="uni-input" v-model="userName" placeholder="输入用户名" />
			</uni-forms-item>
			<uni-forms-item label="密码" class="tagName">
				<uni-easyinput type="password" class="uni-input" v-model="密码" placeholder="输入密码" />
			</uni-forms-item>
			<uni-forms-item label="确认密码" class="tagName">
				<uni-easyinput type="password" class="uni-input" v-model="密码" placeholder="输入密码" />
			</uni-forms-item>
			<view style="display: flex;flex-direction: row;display: space-between;">
				<button @click="" size="mini" style="" type="text">获取手机验证码</button>
			</view>
		</uni-forms>
		<button @click="toMain()" size="small" style="width: 100%;border-radius: 50px;" type="primary">登录</button>
	</view>
<!-- 	<view class="abslrtb flex-column a-center wrap">
		<qui-navbar title="注册"></qui-navbar>
		<view class="topbox flex-column aj-center">
			<image class="logoimg" src="/static/logo.png" mode=""></image>
		</view>
		
		
		
		<view class="form">
			<view class="flex a-center form-item">
				<view class="label">
					<text>手机号</text>
				</view>
				<image class="label_icon" src="/static/images/icon_phone.png" mode=""></image>
				<view class="label_fgs"></view>
				<view class="flex-1">
					<input placeholder-class="placeholder" class="qui-input" type="text" value="" placeholder="请输入手机号" />
				</view>
			</view>
			<view class="flex a-center form-item">
				<view class="label">
					<text>验证码</text>
				</view>
				<image class="label_icon" src="/static/images/icon_code.png" mode=""></image>
				<view class="label_fgs"></view>
				<view class="flex-1">
					<input placeholder-class="placeholder" :password="password" class="qui-input" type="text" value="" placeholder="请输入验证码" />
				</view>
				<view>
					<text style="opacity: 0.8;" class="fs28 ptb20 main-color yzm">获取验证码</text>
				</view>
			</view>
			<view class="flex a-center form-item">
				<view class="label">
					<text>密码</text>
				</view>
				<image class="label_icon" src="/static/images/icon_pw.png" mode=""></image>
				<view class="label_fgs"></view>
				<view class="flex-1">
					<input :password="password" placeholder-class="placeholder" class="qui-input" type="text" value="" placeholder="请输入6-14位密码" />
				</view>
			</view>
			<view class="ptb30 flex">
				<label class="radio">
					<radio @click="changeCheck" :checked="checked" color="#F73131" class="qradio" value="" /><text class="fs24 text-gray">我已阅读并遵守</text> <text class="fs24 main-color underline">《用户协议》</text> <text class="fs24 text-gray">与</text> <text class="fs24 main-color underline">《隐私协议》</text>
				</label>
			</view>
		</view>
		<view class="btns">
			<view class="qbtn">
				<text class="btn-text-color fs30">立即注册</text>
			</view>
		</view>
		
		<view class="bottom">
			
		</view>
	</view> -->
</template>

<script>
	export default {
		data() {
			return {
				phonenumber:'',
				userName:'',
				password:'',
				confirmPassword:'',
				phoneCode:'',
			}
		},
		methods: {
			/* 获取验证码 */
			getCode(){
				let opts = {
					url : '/business/getCode',
					method : 'post'
				}
				let payload = {
					phonenumber:this.phonenumber,
				}
				request.httpRequest(opts,payload).then(res => {
					if (res.code == 200) {
						console.log("获取验证码成功");
					} else {
						console.log("获取失败");
					}
				});
			},
			/* 注册操作 */
			register(){
				let opts = {
					url : '/business/register',
					method : 'post'
				}
				let payload = {
					userName:this.userName,
					phonenumber:this.phonenumber,
					password:this.password,
					confirmPassword:this.confirmPassword,
					phoneCode:this.phoneCode
				}
				request.httpRequest(opts,payload).then(res => {
					if (res.code == 200) {
						console.log("注册成功");
						uni.navigateTo({
							url: '/pages/login/login'
						})
					} else {
						console.log("注册失败");
					}
				});
			}
			changeCheck() {
				this.checked = !this.checked;
			},
			goLogin() {
				uni.navigateTo({
					url: '/pages/auth/login/login'
				})
			},
			goRegister() {
				uni.navigateTo({
					url: '/pages/auth/register/register'
				})
			},
			goForget() {
				uni.navigateTo({
					url: '/pages/auth/forget/forget'
				})
			}
		}
	}
</script>

<style>
	.container {
		padding: 20px;
		font-size: 14px;
		line-height: 24px;
	}

	.tagCode {
		margin: auto;
	}
</style>
